import React from 'react'
import { Spin } from 'antd'
import {messages} from "share/common";

import NullCard from "containers/dashboard/dashboard-component/null-card"
import CardTitle from "containers/dashboard/dashboard-component/card-title"
import dashboardService from "containers/dashboard/dashboard.service";
import menuRoute from "routes/menuRoute";

class PendingRepayment extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      load: false,
      waitForPay: {
        stayWriteOffAmount: 0,
        count: 0
      }
    }
  }

  componentWillMount() {
    this.getWaitForPay();
  }

  getWaitForPay = () => {
    this.setState({load: true});
    dashboardService.getWaitForPay().then(res => {
      this.setState({waitForPay: res.data, load: false});
    })
  };

  render() {
    const {load, waitForPay} = this.state;
    const {removeModule} = this.props;
    return (
      <Spin spinning={load}>
        <CardTitle  cardKey={"6"}
                    title={messages('dashboard.key34'/*待还款*/)}
                    removeModule={(key) => removeModule(key)}
                    reloadModule={this.getWaitForPay}/>
        <div className="card-content"
             style={{cursor: "pointer"}}
             onClick={() => window.open(`${window.ISIE9 ? "#" : ""}${menuRoute.getRouteItem('borrow-management').url}`, '_blank')} >
          {
            waitForPay.count ? (
              <div className="amount-card">
                <div
                  className="amount-title">{waitForPay.count}<span>{messages('dashboard.key140')/*笔待还款*/}</span>
                </div>
                <div className="amount-detail">{messages('dashboard.key165')/*记得赶紧处理哦*/}~</div>
              </div>
            ) : (
              <NullCard imgType={"pendingRepay"} message={messages('dashboard.key166')/*太棒啦！没有待还款！*/}/>
            )
          }
        </div>
      </Spin>
    )
  }
}

PendingRepayment.propTypes = {
  removeModule: React.PropTypes.func.isRequired,
};

PendingRepayment.defaultProps={
};

export default PendingRepayment
